<div id="texto" class="col-sm-offset-2">
		<p id="reglas">
			<h3>Simple Quizz - Instrucciones de uso</h3>
		</p>
		<p>Simple Quizz es un juego para jugar en solitario.
			Consiste en contestar preguntas de un tema determinado que se elije al principio de la partida.
		</p>
</div>
<div id="instrucciones" class="col-sm-offset-2">
	
	<input type="button" class="btn btn-primary" value="Comenzar la partida" id="empezar" /> 
	<!-- <input type="button" class="tex-left" value="Partidas en curso" id="enCurso" /> -->
	<!-- <input type="button" value="OK" id="ok">
	<h3 id="puntos" class="text-center"></h3> -->
</div>


<div id="formularioJuego" title="Dificultad del juego">
</div>
<div id="botonOk" class="col-sm-offset-2">
	<input type="button" class="btn btn-primary " value="OK" id="ok">
	<h3 id="puntos" class="text-center"></h3>
</div>
<input type="button" class="btn btn-primary col-sm-offset-2" value="OK" id="validar"/>
<script>

var preguntasRecuperadas = [];
var contadorPreguntas = 0;
var puntuacion = 0;
var puntuacionTotal = 0;
var idPartida;
/*Boton ok escondido*/
$('#ok').hide();
$('#puntos').hide();
$('#validar').hide();



$(function() {

	 /*Recuperar la id del usuario que va a crear la partida*/
	var idUsuario;
	var urlIdUsuario = "../dispatcher/usuario/idUsuario";
	
	$.getJSON(urlIdUsuario, function(data) {
		idUsuario = data;
	});
 
	$("#validar").click(function () {
	
			
			var ids;
        	
        	var asignatura = $('#asignaturas').val();
        	var dificultad = $('#dificultades').val();
        	var numero = $('#numeroPreguntas').val();
        	
        	
        	if ((asignatura != "") && (dificultad != "" ) && (numero != "" )) {
        	//Crea la partida 
        	var data = '{"jugadorId" : "'+ idUsuario +' " , "dificultad" : "'+ dificultad +' " , "tema" : "'+ asignatura +' " , "juegoId" : "'+ idJuego +'"  }';
			$.ajax({
	               type: "POST",
	                url: "../dispatcher/juego/crearPartida",
	                data: data,
	                beforeSend: function(xhr) {  
	                    xhr.setRequestHeader("Accept", "application/json");  
	                    xhr.setRequestHeader("Content-Type", "application/json");  
	                },  
	                success: function (datos) {
     					idPartida = datos;
	                },
	                error : function (data, status, er) {
	                	alert("error" + data + " status " +status+" er:"+er );
	                }
	            });
        	
        	
        	
        	
        	var urlPreguntas = "../dispatcher/juego/recuperarListaPreguntas";
        	urlPreguntas +="?numPreguntas="+ numero + "&asignaturaId="+ asignatura + "&dificultadId=" + dificultad;
        	
        	// Recuperamos los ids de las preguntas
        	$.getJSON(urlPreguntas, function(data) {
        		ids = data;
				$.each(ids, function(i,item){
					preguntasRecuperadas.push(item.id);
				});   
        	
				// Cargamos la pagina de la pregunta
	        	$('#instrucciones' ).load('juego/unJugador.html',function(){
	        		
	       			recuperarContenido(preguntasRecuperadas[contadorPreguntas],1,3);
	       			contadorPreguntas+=1;
	 			
	        	});
	        });
        	
        	/*Mostramos el boton ok*/
        	$("#ok").show(); 
        	
        	$("#ok").click(function() {
        		
        		$('#instrucciones' ).load('juego/unJugador.html');
  				 var urlValidar = "../dispatcher/juego/validarRespuesta"; 
  				 var valorRadio = $( "input:radio[name=respuesta]:checked" ).val();
  				 urlValidar += "?respuestaId=" + valorRadio;
  				 
  				$.getJSON(urlValidar, function(data) {
  					if (data.respuestaCorrecta == true) {
  						puntuacionTotal += puntuacion;
  					}
        			$('#puntos').text(puntuacionTotal);
  					
  				});
  				/*Condicion para que cuando ya no haya mas preguntas no sigan cargandose*/
  				if (contadorPreguntas < preguntasRecuperadas.length) {
  					recuperarContenido(preguntasRecuperadas[contadorPreguntas],1,3);
  					contadorPreguntas += 1;
        		} else {
        		
        			/*Introducir el metodo para guardar los puntos*/
        			var data = '{"partidaId" :' + idPartida + ', "puntuacionTotal" :' + puntuacionTotal + ', "usuarioId" : '+ idUsuario + '}';
        			$.ajax({
     	                type: "POST",
     	                url: "../dispatcher/juego/resultado",
     	                data: data,
     	                beforeSend: function(xhr) {  
     	                    xhr.setRequestHeader("Accept", "application/json");  
     	                    xhr.setRequestHeader("Content-Type", "application/json");  
     	                },  
     	                success: function (datos) {
     	                },
     	                error : function (data, status, er) {
     	                	alert("error" + data + " status " +status+" er:"+er );
     	                }
     	            });
        	
        			/*Partida terminada*/
        			var data = '{"id" :' + idPartida + '}';
        			$.ajax({
     	                type: "POST",
     	                url: "../dispatcher/juego/partidaTerminada",
     	                data: data,
     	                beforeSend: function(xhr) {  
     	                    xhr.setRequestHeader("Accept", "application/json");  
     	                    xhr.setRequestHeader("Content-Type", "application/json");  
     	                },  
     	                success: function (datos) {
     	                },
     	                error : function (data, status, er) {
     	                	alert("error" + data + " status " +status+" er:"+er );
     	                }
     	            });
        			
					$('#puntos').hide();
					$('#contenedor').hide();
					$('#ok').hide();
					$('#instrucciones' ).load('juego/puntuacion.html');
					
        			
        		}; 
        		
        	});
        
        	$("#formularioJuego").hide();
        	$("#validar").hide();
      	} else {
        		alert("Debe rellenar todos los campos");
        	}
	
	}
	);

	$( "#empezar" ).click(function() {
		// TODO load du elegirTemaYEso
		$("#validar").show();
		$( "#formularioJuego" ).load('juego/elegirTemaYDificultadYNumeroPreguntas.html');
	});
	
/* 	$( "#enCurso" ).click(function() {
		$('#instrucciones' ).load('juego/partidosEmpezados.html');
	}); */
  });
  
  function recuperarContenido(id, numRespuestaOK, numRespuestaKO){
	  
	var enunciadoPregunta;
	var enunciadoRespuesta;
	var idRespuesta;
	
	//Recuperar el enunciado de la pregunta  
	var urlPreguntas = "../dispatcher/juego/recuperarContenidoPreguntas";
  	urlPreguntas += "?preguntaId="+ id;
  	$.getJSON(urlPreguntas, function(data){
  		puntuacion = data.puntuacion;
  		enunciadoPregunta = data.enunciado;
  		$('#pregunta').text(enunciadoPregunta); 
  		
  	});
  	
  	/*Recuperar el enunciado de las respuestas correctas*/
  	var contadorRespuestas = 1;
  	var urlRespuestas="../dispatcher/juego/recuperarContenidoRespuestas"
  	urlRespuestas += "?numRespuestasOK="+ numRespuestaOK + "&numRespuestasKO="+ numRespuestaKO + "&preguntaId="+ id; 
  	$.getJSON(urlRespuestas, function(data){
  		$.each(data, function(i, item){
  			enunciadoRespuesta = item.enunciado;
  			idRespuesta = item.id;
  			$('#label'+contadorRespuestas+'').text(enunciadoRespuesta);
  			$('#respuesta'+contadorRespuestas+'').val(idRespuesta);
  			contadorRespuestas += 1;  			
  		});
  	
  	});
  	
  }
</script>